import { ajaxPromise } from "./ajax.js";

var chinaJSON = await ajaxPromise({ url: "../data/china.json" });

echarts.registerMap("china", chinaJSON);

var GeoData = {};
var geoData = JSON.parse(chinaJSON).features.forEach((v) => {
    let { properties: { name, cp } } = v;
    GeoData[name] = cp;
})

console.log(GeoData);


var putInList = [{
    name: "北京",
    value: 12345,
}, {
    name: "上海",
    value: 9834,
}, {
    name: "云南",
    value: 2846,
}, {
    name: "辽宁",
    value: 3244,
}, {
    name: "新疆",
    value: 3244,
}]

function lineCoords(GeoData, data, target, reverse = false) {
    var coordsList = [];
    if (reverse) {
        for (var i = 0; i < data.length; i++) {
            var item = data[i];
            if (item.name != target) {
                var obj = {};
                obj.coords = [GeoData[target], GeoData[item.name]];
                coordsList.push(obj);
            }
        }
    } else {
        for (var i = 0; i < data.length; i++) {
            var item = data[i];
            if (item.name != target) {
                var obj = {};
                obj.coords = [GeoData[item.name], GeoData[target]];
                coordsList.push(obj);
            }
        }
    }
    return coordsList;
}


// console.log(lineCoords(GeoData, putInList, "湖北"));






var homeChina = document.getElementsByClassName("home-china")[0];
var echartChina = echarts.init(homeChina);

var option = {
    tooltip: {
        show: true,
    },
    geo: {
        map: "china",
        show: true,
        label: true,
        roam: "scale",
        scaleLimit: {
            min: 0.5,
            max: 1.2
        },
        label: {
            show: true,
            color: "#fff",
        },
        itemStyle: {
            // areaColor: "transparent",
            color: "transparent",
            borderColor: "#116faf",
            borderWidth: 1,
            borderStyle: "solid",

        },

    },
    series: [{
        type: "lines",
        lineStyle: {
            color: "#fdeb40",
            borderColor: "#fdeb40",
            borderWidth: 2,
            borderStyle: "solid",
            curveness: 0.2
        },
        effect: {
            show: true,
            delay: 200,
            symbol: "triangle",
            symbolSize: 10,
            // color: "#6ff"
        },
        // data: [{
        //     coords: [
        //         [116.4551, 40.2539],
        //         [112.2363, 31.1572]
        //     ]
        // }],
        data: lineCoords(GeoData, putInList, "香港"),
    }],
}


echartChina.setOption(option);